<template>
    <div class="personal-statistics">
        <grid-list :layout="layout" v-on:modifyLayout="modifyLayout"></grid-list>
    </div>
</template>

<script>
    import VueGridLayout from 'vue-grid-layout';
    import GridList from '../../../components/grid/index.vue';
    export default {
        name: "personal-statistics",
        components: {
            VueGridLayout,
            GridList
        },
        data() {
            return {
                layout: [
                    {"x":0,"y":0,"w":24,"h":4,"i":"0","name":"RecentData",'params':{'title':'近30天数据','name':'default'}},
                    {"x":0,"y":3,"w":12,"h":3,"i":"1","name":"NewUserModel",'params':{'title':'新用户','name':'default'}},
                    {"x":12,"y":3,"w":12,"h":3,"i":"2","name":"OldUserModel",'params':{'title':'旧用户','name':'default'}},
                    {"x":0,"y":6,"w":18,"h":6,"i":"3","name":"OrderTable",'params':{'title':'旧用户','name':'default'}},
                    {"x":18,"y":7,"w":6,"h":2,"i":"4","name":"CarCard",'params':{'title':'旧用户','name':'default'}},
                    {"x":18,"y":10,"w":6,"h":11.5,"i":"5","name":"ActivityList",'params':{'title':'活动通知','name':'default'}}
                  ]
            }
        },
        methods: {
            modifyLayout(value) {
                this.layout = value;
                // console.info('新的', JSON.stringify(this.layout));
            }
        }
    }
</script>

<style scoped lang="less">
.personal-statistics{
    padding: 10px 0;
}
</style>
